

<div id="tools_bottom">
  <!-- Zoom buttons -->
  <div>
    <span>缩放</span>

    <se-zoom  class="divwrap" part="divwrap" id="zoom" src="zoom.svg" title="Change zoom level">
      <se-text value="1000" text="1000"></se-text>
      <se-text value="400" text="400"></se-text>
      <se-text value="200" text="200"></se-text>
      <se-text value="100" text="100"></se-text>
      <se-text value="50" text="50"></se-text>
      <se-text value="25" text="25"></se-text>
      <!-- <se-text value="canvas" text="tools.fit_to_canvas"></se-text>
        <se-text value="selection" text="tools.fit_to_sel"></se-text>
        <se-text value="layer" text="tools.fit_to_layer_content"></se-text>
        <se-text value="content" text="tools.fit_to_all"></se-text> -->
    </se-zoom>
  </div>
  <div>
      <span>填充颜色</span>
    <se-colorpicker class="divwrap" part="divwrap" id="fill_color" src="fill.svg" imgnone="true" type="fill"></se-colorpicker>

  </div>
  <div>
    <span>填充风格</span>
    <se-select class="divwrap" id="fill_style" label=""
      options="实心,无,线性渐变,垂直纹理,水平纹理"
      values="solidColor::none::line_style::vert_style::hori_style" width="100px">
    </se-select>

  </div>
  <div>
    <span>线条颜色</span>
    <se-colorpicker  class="divwrap" part="divwrap" id="stroke_color" src="stroke.svg" type="stroke" ></se-colorpicker>
  </div>

  <div>
    <span>线条宽度</span>
    <se-spin-input id="stroke_width" min=0 max=99 step=1 label=""  class="divwrap" part="divwrap"></se-spin-input>
  </div>

  <div>
    <span>线条风格</span>
    <se-select id="stroke_style" label=""  class="divwrap" part="divwrap" options="&#8212;,...,- -,- .,- .."
      values="none::2,2::5,5::5,2,2,2::5,2,2,2,2,2" width="100px">
    </se-select>
  </div>
  <div>
    <span>连接风格</span>
    <se-select id="stroke_linejoin" label="" options="properties.linejoin_miter,properties.linejoin_round,properties.linejoin_bevel"
      values="miter::round::Linejoin:bevel"  class="divwrap" part="divwrap" width="100px">
    </se-select>
    <!-- <se-list id="stroke_linejoin" title="properties.linejoin_miter" label="" width="22px" height="22px">
        <se-list-item id="linejoin_miter" value="miter" src="linejoin_miter.svg" title="properties.linejoin_miter" img-height="22px"></se-list-item>
        <se-list-item id="linejoin_round" value="round" src="linejoin_round.svg" title="properties.linejoin_round" img-height="22px"></se-list-item>
        <se-list-item id="linejoin_bevel" value="bevel" src="linejoin_bevel.svg" title="properties.linejoin_bevel" img-height="22px"></se-list-item>
      </se-list> -->
  </div>
  <div>
    <span>顶端样式</span>
    <se-select  class="divwrap" part="divwrap"  id="stroke_linecap" label=""
      options="properties.linecap_butt,properties.linecap_square,properties.linecap_round" values="butt::square::round"  width="100px">
    </se-select>
    <!-- <se-list id="stroke_linecap" title="properties.linecap_butt" label="" width="22px" height="22px">
        <se-list-item id="linecap_butt" value="butt" src="linecap_butt.svg" title="properties.linecap_butt" img-height="22px"></se-list-item>
        <se-list-item id="linecap_square" value="square" src="linecap_square.svg" title="properties.linecap_square" img-height="22px"></se-list-item>
        <se-list-item id="linecap_round" value="round" src="linecap_round.svg" title="properties.linecap_round" img-height="22px"></se-list-item>
      </se-list> -->
  </div>
  <div>
    <span>
      透明度
    </span>
    <se-spin-input size="3" id="opacity" min=0 max=100 step=5 hide="true"  class="divwrap" part="divwrap"></se-spin-input>

  </div>


  <div class="showCube" style="width: 100%;display: none;">
    <div>
      <span>立方体</span>
    </div>
    <div>
      <span>前:</span>
      <se-colorpicker id="fill_color_front" src="fill.svg" type="fill">
      </se-colorpicker>

      <span>侧:</span>
      <se-colorpicker id="fill_color_left" src="fill.svg" type="fill"></se-colorpicker>

      <span>顶:</span>
      <se-colorpicker id="fill_color_top" src="fill.svg" type="fill"></se-colorpicker>
    </div>
  </div>


</div>
